<html>

<head>
  <meta charset="utf-8">
  <title>表单元素</title>
  <meta name="renderer" content="webkit">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport"
    content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
  <link rel="stylesheet" href="/Public/layui/css/layui.css" media="all">
  <link rel="stylesheet" href="/Public/style/admin.css" media="all">
  <link id="layuicss-layer" rel="stylesheet"
    href="https://www.layui.com/admin/std/dist/layuiadmin/layui/css/modules/layer/default/layer.css?v=3.1.1"
    media="all">
  <style id="LAY_layadmin_theme">
    .layui-side-menu,
    .layadmin-pagetabs .layui-tab-title li:after,
    .layadmin-pagetabs .layui-tab-title li.layui-this:after,
    .layui-layer-admin .layui-layer-title,
    .layadmin-side-shrink .layui-side-menu .layui-nav>.layui-nav-item>.layui-nav-child {
      background-color: #20222A !important;
    }

    .layui-nav-tree .layui-this,
    .layui-nav-tree .layui-this>a,
    .layui-nav-tree .layui-nav-child dd.layui-this,
    .layui-nav-tree .layui-nav-child dd.layui-this a {
      background-color: #009688 !important;
    }

    .layui-layout-admin .layui-logo {
      background-color: #20222A !important;
    }
  </style>
</head>

<body layadmin-themealias="default">
  <div class="layui-fluid">
    <div class="layui-row layui-col-space15">
      <div class="layui-col-md12">
        <div class="layui-card">
          <div class="layui-card-header">添加角色</div>
          <div class="layui-card-body">
            <form class="layui-form" action="" lay-filter="component-form-element">
              <div class="layui-row layui-col-space10 layui-form-item">
                <div class="layui-col-lg6">
                  <label class="layui-form-label">角色名称：</label>
                  <div class="layui-input-block">
                    <input type="text" name="name" lay-verify="required" placeholder="" autocomplete="off"
                      class="layui-input">
                  </div>
                </div>
              </div>
              <div class="layui-row layui-col-space10 layui-form-item">
                <div class="layui-col-lg6">
                  <label class="layui-form-label">角色描述：</label>
                  <div class="layui-input-block">
                    <input type="text" name="remark" lay-verify="required" placeholder="" autocomplete="off"
                      class="layui-input">
                  </div>
                </div>
              </div>
              <div class="layui-form-item">
                <label class="layui-form-label">是否开启：</label>
                <div class="layui-input-block">
                  <div class="layui-unselect layui-form-radio">
                    <input type="radio" name="status" value="0" title="关闭">
                    <input type="radio" name="status" value="1" title="开启" checked>
                  </div>
                </div>
              </div>

              <input type="hidden" name="pid" value="0" >

              <div class="layui-form-item">
                <div class="layui-input-block">
                  <button class="layui-btn" lay-submit lay-filter="formDemo">立即提交</button>
                  <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                </div>
              </div>
            </form>
          </div>
        </div>
      </div>
    </div>
  </div>


  <!-- action="{:U('Rbac/addRoleHandle')}" method="POST" -->

  <script src="/Public/layui/layui.js"></script>
  <script>
    //Demo
    layui.use('form', function () {
      var $ = layui.$
        , form = layui.form;

      //监听提交
      form.on('submit(formDemo)', function (data) {
        // var json = JSON.stringify(data.field);
        $.post('{:U('Rbac/addRoleHandle')}', data.field, function (res) {
          if (res.code == 0) {
            layer.msg(res.msg, { 
              icon: 1 ,
              shade:0.3,
              end: function () { location.href = "{:U('Rbac/roleList')}" }
              });
           
           }else {
            layer.msg(res.msg, { 
              icon: 5,
              shade:0.3
              });
          }
        })
        return false;
      });
    });
  </script>

</body>

</html>